<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="../../../common/css/friend.css" />
		<link rel="stylesheet" type="text/css" href="../../../common/zui/css/zui.css" />
		<link rel="stylesheet" type="text/css" href="../../../common/bootstrap/css/bootstrap.min.css" />

		<link rel="stylesheet" type="text/css" href="../../../common/layui/css/layui.css" />
		<!--文章编辑器-->
		<link rel="stylesheet" type="text/css" href="../../../common/css/bootstrap-grid.min.css">
		<link rel="stylesheet" type="text/css" href="../../../common/css/demo.css">
		<link href="../../../common/css/quill.snow.css" rel="stylesheet">
		<style type="text/css">
			#editor-container {
				height: 400px;
			}
		</style>
		<!--表情包插件-->
		<link rel="stylesheet" type="text/css" href="../../../common/css/jquery.sinaEmotion.css">
		<!--<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>-->
		<script type="text/javascript" src="../../../common/js/jquery-1.11.3.js"></script>
		<script type="text/javascript" src="../../../common/js/jquery.sinaEmotion.js"></script>
		<script src="../../../common/layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="../../../common/bootstrap/js/bootstrap.js"></script>
		<script type="text/javascript" src="../../../common/zui/js/zui.min.js"></script>

		<title>朋友圈</title>

		<script type="text/javascript">
			$(document).ready(function() {
				// 绑定表情
				$('#face').SinaEmotion($('.emotion'));
				//解析表情
				var weiboText = $(".WB_text");
				
				//console.log(weiboText);
				weiboText.each(function(i,obj) {
					var $obj = $(obj);
					var weiboTxt = $obj.html();	
					//console.log(weiboTxt)
					weiboTxt = AnalyticEmotion(weiboTxt);
					
					$obj.html(weiboTxt)
			})
				$(".zan_input").next().addClass("zan");
				//左边标签选中事件
				$(".lev_Box").on("click", function() {
					$(".lev_Box").removeClass("lev_active");
					$(".lev").removeClass("lev_active");
					$(this).addClass("lev_active");
				})
				$(".lev").on("click", function() {
						$(".lev_Box").removeClass("lev_active");
						$(".lev").removeClass("lev_active");
						$(this).addClass("lev_active");
					})
					//朋友圈权限

				$(".power").on("click", function() {
					$(".dropdown-menu").show();
				})
				$(".dropdown-menu a").on("click", function() {
						$(".power").text($(this).text());
						$(".dropdown-menu").hide();
					})
					//中间tag
				$(".W_fl li a").on("click", function() {
					$(".W_fl li a").removeClass("font_weight")
					$(this).addClass("font_weight")
				})

				//文章标题字数监听
				$(".title_msg").on("keyup", function() {

						var wordLen = $(".title_msg").val().length;
						var maxLen = $(".max_words").text();
						$(".words_len").html(wordLen);
						if(wordLen > 44) {
							var wordtext = $(".title_msg").val().substring(0, 43);
							$(".title_msg").val(wordtext);
							alert("字数超过限制")
							$(".words_len").text(44);
						}
					})
					//朋友圈输入框字数监听
				$(".W_input").on("keyup", function() {
						var wordLen = $(".W_input").val().length;
						var maxLen = $(".max_words").text();
						$(".words_len").html(wordLen);
						if (wordLen > 0) {
							$(".W_btn_a").attr("disabled",false);
						}
						if(wordLen > 200) {
							var wordtext = $(".W_input").val().substring(0, 199);
							$(".W_input").val(wordtext);
							alert("字数超过限制")
							$(".words_len").text(200);
						}
					})
					//多图片上传按钮
				$("#test2").on("click",function(){
					$(".layui-quote-nm").show();
				})
					//话题按钮
				$(".insert_topic").on("click", function() {
						$("#myModal2").hide();
						$(".modal-backdrop").remove();
						var text = $(".W_input").val();
						if($(".topic_txt").val() != ""){
							var topic = "#"+$(".topic_txt").val()+"#";
							$(".W_input").val(text + topic);
							$(".topic_txt").attr("value",topic);
						}
						
					})
					//点赞
				$(".pos_line").on("click", function() {
					var num = parseInt($(this).find("span").text());
					var userId = $("#userId").val()
					var weiboId = $(this).next().val()
					var $this = $(this)
					if(!$(this).hasClass("zan")) {
						$.post("/friend/zan",
								{"userId":userId,"weiboId":weiboId},
								function(data) {
									$this.addClass("zan");
									$this.find("span").text(num + 1);
								}
								)
						
					} else {
						$.post("/friend/diszan",
								{"userId":userId,"weiboId":weiboId},
								function(data) {
									$this.removeClass("zan");
									$this.find("span").text(num - 1);
								}
								)
						
					}

				})
				//原创
				$(".original_tab").on("click",function(){
					
					
					$(".WB_box").load("/show/original");
						
					
					/*$.post("/friend/original",
					function(data){
						$(".WB_common").load("/show/original?time="+new Date());
						$(".WB_forward").remove();
					},
					"text"
					)*/

				})
				//图片img_tab
				$(".img_tab").on("click",function(){
					
					
					$(".WB_box").load("/show/img");
						
					
					/*$.post("/friend/img",
					function(data){
						$(".WB_common").load("/show/img?time="+new Date());
						$(".WB_forward").remove();
						$(".WB_article").remove();
					},
					"text"
					)*/

				})
				//文章article_tab
				$(".article_tab").on("click",function(){
					
					
					$(".WB_box").load("/show/article");
					
					
					/*$.post("/friend/article",
					function(data){
						$(".WB_article").load("/show/article?time="+new Date());
						$(".WB_forward").remove();
						$(".WB_common").remove();
					},
					"text"
					)*/

				})
				//好友圈
				$(".friendCycle").on("click",function(){
					$.post("/friend/friendCycle?userId=${sessionScope.user.userId}",
					
					function(data){
						$(".WB_box").load("/show/friendCycle");
					}
					)
					
//					$(".WB_forward").remove();
//					$(".WB_article").remove();//WB_tab_a
//					$(".tab_box_m").remove();
				})
				//本地生活local_life
				$(".funny").on("click",function(){
					$.post("/friend/funny?flag=搞笑",
					
					function(data){
						$(".WB_box").load("/show/friendCycle");
					}
					)
					
//					$(".WB_forward").remove();
//					$(".WB_article").remove();//WB_tab_a
//					$(".tab_box_m").remove();
				})
				//监听texarea
				
				//发布微博
				$(".W_btn_a").click(function() {
					
					var myform = new FormData(document.getElementById("myform"));
					if($(".topic_txt").val() != ""){
						myform.append("topicName", "#"+$(".topic_txt").val()+"#");
					}
					myform.append("weiboJurisdiction",$(".power").text());
					
					$.ajax({
						url: "/friend/publish",
						type: "POST",
						data: myform,
						processData: false, // 不处理数据
						contentType: false, // 不设置内容类型
						success:function(data){ 
							if (data == "success") {
								//console.log(data)
								window.location.href = "/friend/index?curtime="+new Date();
							}
							
						}
					});
					
					
				});
				//发布文章
				$(".publish_text").click(function(){
					var myform2 = new FormData(document.getElementById("myform2"));
					myform2.append("logContent",$(".ql-editor").html());
					
					$.ajax({
						url: "/friend/publishLog",
						type: "POST",
						data: myform2,
						processData: false, // 不处理数据
						contentType: false, // 不设置内容类型
						success:function(data){ 
							//console.log(data)
							window.location.href = "/friend/index"
						}
					});
				})
				
				
		
				
				
				
				
				
			})
		</script>
		<script>
			layui.use('upload', function() {
				var $ = layui.jquery,
					upload = layui.upload;

				//普通图片上传
				var uploadInst = upload.render({
					elem: '#test1',
					url: '/friend/uploadlog',
					size: 1024 * 3,
					before: function(obj) {
						//预读本地文件示例，不支持ie8
						obj.preview(function(index, file, result) {
							$('#demo1').attr('src', result); //图片链接（base64）
						});
					},
					done: function(res) {
						//上传完毕
						console.log(res);
						$(".article_imgpath").attr("value",res.src);
						
					}
				});
				//多图片上传
				upload.render({
					elem: '#test2',
					url: '/friend/upload',
					multiple: true,  //开启多文件
					size:1024*20,		//	大小限制
					accept:'images',		//类型限制
					before: function(obj) {
						//预读本地文件示例，不支持ie8
						obj.preview(function(index, file, result) {
							$('#demo2').append('<img style="height: 100px;width: 100px;margin-left: 5px;" src="' + result + '" alt="' + file.name + '" class="layui-upload-img">')
						});
					},
					done: function(res) {
						//上传完毕
						console.log(res);
						$("#test2").append("<input type='text' name='uploadImg' value='"+res.src+"'style='display:none' />");
					}
				});
			});
		</script>
	</head>

	<body>
		<div class="WB_body">
		<input type="hidden" id="userId" value="${user.userId }"/>
			<div class="WB_main">
				<div class="plc_top">
					<div class="WB_global_nav">
						<div class="gn_header clearfix">
							<div class="row">
								<div class="col-md-6">
									<div class="gn_logo">
										<a class="box" href="#">
											<img src="../../../common/img/sunkai/WB_logo.png" />
										</a>
									</div>
									<div class="gn_search_v2">
										<input class="W_input1" type="text" placeholder="新昌救援队员不幸落水遇难" value="" />
										<a class=".ficon_search" href="#"><i class="icon icon-search "></i></a>
										<div class="gn_topmenulist_search" style="">

										</div>
									</div>
								</div>
								<div class="col-md-4">
									<div class="gn_nav">
										<ul class="gn_nav_list">
											<li>
												<a class="S_txt1" href="#">
													<i class="icon icon-home"></i>
													<span>首页</span>
												</a>
											</li>
											<li>
												<a class="S_txt1" href="#">
													<i class="icon icon-camera-retro"></i>
													<span>视频</span>
												</a>
											</li>
											<li>
												<a class="S_txt1" href="#">
													<i class="icon icon-eye-open"></i>
													<span>发现</span>
												</a>
											</li>
											<li>
												<a class="S_txt1" href="#">
													<i class="icon icon-gamepad"></i>
													<span>游戏</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
								<div class="col-md-2">
									<ul class="gn_login_list">
									<c:choose>
									<c:when test="${empty user }">
										<li>
											<a href="#" class="S_txt1">注册</a>
										</li>
										<li class="W_vline S_line1"></li>
										<li>
											<a node-type="loginBtn" href="#" class="S_txt1">登录</a>
										</li></c:when>
									<c:otherwise>
										<li>
												<a class="S_txt1" href="/Homepage/showHomePage?userId=${user.userId }">
													<i class="layui-icon layui-icon-username" style="display: inline;"></i>
													<span>${user.userName }</span>
												</a>
										</li>
										<li class="W_vline S_line1"></li>
										<li>
												<a class="S_txt1" href="/dialog/show">
													<i class="layui-icon layui-icon-release" style="display: inline;"></i>
													
												</a>
										</li>
									</c:otherwise>
									</c:choose>
										
										
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>

				<div class="plc_fram">
					<div class="WB_main_l">
						<div class="lev_Box lev_active">
							<h3>
								<a href="/friend/index"><span class="levtxt">首页</span></a>
							</h3>
						</div>
						<div class="lev_Box">
							<h3>
								<a href="javascript:"><span class="levtxt">我的收藏</span></a>
							</h3>
						</div>
						<div class="lev_Box">
							<h3>
								<a href="javascript:"><span class="levtxt">我的赞</span></a>
							</h3>
						</div>
						<div class="lev_line">
							<fieldset></fieldset>
						</div>
						<div class="lev_Box2">
							<div class="lev">
								<a class="S_txt1" href="/hotClassify/index">
									<span class="ico_block"><i class="icon icon-rocket"></i></span>
									<span class="levtxt">热门微博</span>
								</a>
							</div>
							<div class="lev">
								<a class="S_txt1" href="javascript:">
									<span class="ico_block"><i class="icon icon-camera-retro"></i></span>
									<span class="levtxt">热门视频</span>
								</a>
							</div>
						</div>
						<div class="lev_line">
							<fieldset></fieldset>
						</div>
						<div class="lev_Box2">
							<div class="lev">
								<a class="S_txt1" href="javascript:">
									<span class="ico_block"><i class="icon icon-time"></i></span>
									<span class="levtxt">最新微博</span>
								</a>
							</div>
							<div class="lev">
								<a class="S_txt1 friendCycle" href="javascript:">
									<span class="ico_block"><i class="icon icon-github"></i></span>
									<span class="levtxt">好友圈</span>
								</a>
							</div>
							<div class="lev">
								<a class="S_txt1" href="#">
									<span class="ico_block"><i class="icon icon-dot-circle"></i></span>
									<span class="levtxt">特别关注</span>
								</a>
							</div>
						</div>
						<div class="lev_line">
							<fieldset></fieldset>
						</div>
						<!--我的的关注  类别 动态显示-->
						<div class="lev_Box2">
							<div class="lev">
								<a class="S_txt1 local_life" href="javascript:">
									<span class="ico_block"><i class="icon icon-caret-right"></i></span>
									<span class="levtxt">本地生活</span>
								</a>
							</div>
							<div class="lev">
								<a class="S_txt1 funny" href="javascript:">
									<span class="ico_block"><i class="icon icon-caret-right"></i></span>
									<span class="levtxt">搞笑幽默</span>
								</a>
							</div>
							<div class="lev">
								<a class="S_txt1" href="javascript:">
									<span class="ico_block"><i class="icon icon-caret-right"></i></span>
									<span class="levtxt">视频音乐</span>
								</a>
							</div>
						</div>
					</div>
					<div class="plc_main">
						<div class="WB_main_c">
							<div class="v6_pl_content_publishertop">
								<div class="send_weibo">
									<form id="myform">
									<img src="../../../common/img/sunkai/input1.png" style="width: 200px; height: 30px; display: inline-block;" />
									<div class="limit_text" style="margin-top: 0px!important;">
										<span class="words_len">0</span>/<span class="max_words">200</span>
									</div>
									<div class="send_input">
										<textarea name="weibiContent" class="W_input emotion"></textarea>
									</div>
									<div class="func_area">
										<div class="func">
											<div class="btn-group">
												<button type="button" class="btn dropdown-toggle power" data-toggle="dropdown">公开 <span class="caret"></span></button>
												<ul class="dropdown-menu" role="menu">
													<li>
														<a href="###">公开</a>
													</li>
													<li>
														<a href="###">好友圈</a>
													</li>
													<li>
														<a href="###">仅自己</a>
													</li>
												</ul>
											</div>
											<button class="W_btn_a" disabled="disabled" href="javascript:">发布</button> 
										</div>
										<div class="kind">
											<a id="face" class="S_txt1" href="#"><i class="icon icon-smile"></i>&nbsp;表情</a>
											<a class="S_txt1" href="javascript:" id="test2"><i class="icon icon-picture"></i>&nbsp;图片</a>
											<blockquote class="layui-elem-quote layui-quote-nm" style="display:none;position: absolute;background: #fff;z-index: 9999;">
											    预览图：
											    <div class="layui-upload-list" id="demo2"></div>
											</blockquote>
											<a class="S_txt1 topic_a" href="#" id="topic_model" data-toggle="modal" data-target="#myModal2"><i class="icon icon-bars"></i>&nbsp;话题</a>
											<a class="S_txt1 " data-toggle="modal" data-target="#myModal" href="#"><i class="icon icon-bolt"></i>&nbsp;头条文章</a>
										</div>
									</div>
									</form>
								</div><!--send_weibo-->

							</div> 
							<div class="WB_tab_a">
								<div class="tab_box_m">
									<ul class="W_fl">
										<li>
											<a class="S_txt1 font_weight" href="/friend/index">全部</a>
										</li>
										<li>
											<a class="S_txt1 original_tab" href="javascript:">原创</a>
										</li>
										<li>
											<a class="S_txt1 img_tab" href="javascript:">图片</a>
										</li>
										<li>
											<a class="S_txt1" href="javascript:">视频</a>
										</li>
										<li>
											<a class="S_txt1" href="javascript:">音乐</a>
										</li>
										<li>
											<a class="S_txt1 article_tab" href="javascript:">文章</a>
										</li>
									</ul>

								</div>
							</div>
							
							<div class="WB_box">
							
							
							<div class="WB WB_common">
							<c:forEach items="${weiboList}" var="weibo">
							  
							  
								<div class="WB_info">
									<div class="WB_cardtitle_b">
										<span class="type_title">
										<i class="icon icon-chevron-right"></i>
										<a href="#">${weibo.type.typeName }</a>
									</span>

									</div>
									<div class="WB_feed_detail">
										<div class="WB_head">
											<div class="head_pic">
												<a href="#"><img src="http://localhost:8082/serverpath${weibo.user.userHeadpath }" /></a>
											</div>
										</div>
										<div class="WB_detail">
											<div class="WB_info_head">
												<a href="/common/showTaDeHomePage?userId=${weibo.user.userId} ">${weibo.user.userName }</a>
											</div>
											<div class="WB_from">
												<a href="#">${weibo.weiboTime }</a>
												来自
												<a href="#">${weibo.weiboSource}</a>
											</div>
											<div class="WB_text">
											<c:choose>
												<c:when test="${empty weibo.topic.topicName }">${weibo.weiboContent }</c:when>
												<c:otherwise><a href="#" style="color: #FA7D3C!important;">${weibo.topic.topicName}</a>${weibo.weiboContent }</c:otherwise>
											</c:choose>
												
											
											</div>
											
											<div class="WB_media_wrap">
												<div class="media_box">
												
													<ul class="media_img">
													<c:forEach items="${weibo.imgList }" var="img">
													<c:choose>
													<c:when test="${empty img.imgPath}"></c:when>
													<c:otherwise>
														<li class="">
															<img src="http://localhost:8082/serverpath${img.imgPath }" />
														</li>
														</c:otherwise>
													</c:choose>
													</c:forEach>
													</ul>
													
													
												</div>
											</div>

										</div>
									</div>
									<div class="WB_handle">
										<ul class="handle_ul">
											<li>
												<a href="javascript:"><span class="pos">
													
														<span class="pos_line">
															<i class="icon icon-star-empty"></i>
															收藏
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-share"></i>
															${weibo.weiboForwardnum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-chat-dot"></i>
															${weibo.weiboCommentnum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:">
												<span class="pos">
													<c:forEach items="${zanList}" var="zan">
													 <c:choose>
														<c:when test="${zan.weiboId==weibo.weiboId}">
															<input class="zan_input" type="hidden" value="1"/>
														</c:when>
														<c:otherwise>
															
														</c:otherwise>
														</c:choose>
													</c:forEach>
													<span class="pos_line">
														<i class="icon icon-thumbs-up"></i>
														<span>${weibo.weiboZannum }</span>
													</span>
													<input type="hidden" value="${weibo.weiboId}"/>
												</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
							  
							</c:forEach>
							</div>
							

							
							<div class="WB WB_forward">
							<c:forEach items="${forwardList}" var="forward">
								<div class="WB_info">
									<!-- <div class="WB_cardtitle_b">
										<span class="type_title">
										<i class="icon icon-chevron-right"></i>
										<a href="#">教育</a>
									</span>

									</div> -->
									<div class="WB_feed_detail">
										<div class="WB_head">
											<div class="head_pic">
												<a href="#"><img src="http://localhost:8082/serverpath${forward.users.userHeadpath }" /></a>
											</div>
										</div>
										<div class="WB_detail">
											<div class="WB_info_head">
												<a href="#">${forward.users.userName }</a>
											</div>
											<div class="WB_from">
												<a href="#">${forward.forwardingTime }</a>
												来自
												<a href="#">${forward.weibo.weiboSource }</a>
											</div>
											<div class="WB_text">
												${forward.forwardingContent }
											</div>
											<div class="WB_feed_expand">
												<div class="WB_expand">
													<div class="expand_info">
														<a href="#">@${forward.weibo.user.userName }</a>
													</div>
													<div class="expand_tex">
														<c:choose>
															<c:when test="${empty forward.weibo.topic.topicName }">${forward.weibo.weiboContent }</c:when>
															<c:otherwise><a href="#" style="color: #FA7D3C!important;">${forward.weibo.topic.topicName}</a>${forward.weibo.weiboContent }</c:otherwise>
														</c:choose>
													</div>
													<div class="WB_media_wrap">
														<div class="media_box">
															<ul class="media_img">
															<c:forEach items="${forward.weibo.imgList}" var="img">
																<c:choose>
																<c:when test="${empty img.imgPath}"></c:when>
																<c:otherwise>
																	<li class="">
																		<img src="http://localhost:8082/serverpath${img.imgPath }" />
																	</li>
																	</c:otherwise>
																</c:choose>
															</c:forEach>
															</ul>
														</div>
													</div>
													<div class="expand_foot">
														<a href="javascript:">详情</a>
													</div>
												</div>
											</div>
										</div>
										

									</div>
									<div class="WB_handle">
										<ul class="handle_ul">
											<li>
												<a href="javascript:"><span class="pos">
													
														<span class="pos_line">
															<i class="icon icon-star-empty"></i>
															收藏
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-share"></i>
															${forward.weibo.weiboForwardnum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-chat-dot"></i>
															${forward.weibo.weiboCommentnum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-thumbs-up"></i>
															${forward.weibo.weiboZannum }
														</span>
													</span>
												</a>
											</li>
										</ul>
									</div>
								</div>

							</c:forEach>
							</div>
							
							<!--WB WB_article-->
							<div class="WB WB_article">
								<c:forEach items="${logList }" var="log">
								<div class="WB_info">
									
									<div class="WB_feed_detail">
										<div class="WB_head">
											<div class="head_pic">
												<a href="#"><img src="http://localhost:8082/serverpath/${log.user.userHeadpath }" /></a>
											</div>
										</div>
										<div class="WB_detail">
											<div class="WB_info_head">
												<a href="#">${log.user.userName }</a>
											</div>
											<div class="WB_from">
												<a href="#">${log.logTime }</a>
												来自
												<a href="#">${log.logSource }</a>
											</div>
											<div class="WB_text">
												${log.logGuide }
											</div>
											<div class="WB_media_wrap">
												<div class="media_box">
													<div class="article_div">
														<div class="article_img">
														<a href="/ArticlePage/showArticle?logId=${log.logId }"><img src="http://localhost:8082/serverpath/${log.logImgpath }"/></a>
														</div>
														<div class="article_title">
															<h4>${log.logTitle }</h4>
														</div>
													</div>
												</div>
											</div>

										</div>
									</div>
									<div class="WB_handle">
										<ul class="handle_ul">
											<li>
												<a href="javascript:"><span class="pos">
													
														<span class="pos_line">
															<i class="icon icon-star-empty"></i>
															收藏
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-share"></i>
															${log.logSharenum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-chat-dot"></i>
															${log.logCommentnum }
														</span>
													</span>
												</a>
											</li>
											<li>
												<a href="javascript:"><span class="pos">
														<span class="pos_line">
															<i class="icon icon-thumbs-up"></i>
															${log.logZannum }
														</span>
													</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
								</c:forEach>
							</div>
							
						
							</div>	
						</div>
						<div class="WB_main_r">
							<div class="WB_cardwrap">
								<div class="W_person_info">
									<div class="skin_cover" style="background-repeat: no-repeat;background: url(http://localhost:8082/serverpath${sessionScope.user.userBgpath}") repeat scroll top left;">
										<div class="headpic">
										<c:choose>
											<c:when test="${empty sessionScope.user.userHeadpath}">
											<a href="#"><img class="W_face_radius" src="http://localhost:8082/serverpath/img/user/1.jpg" /></a>
											</c:when>
											<c:otherwise><a href="#"><img class="W_face_radius" src="http://localhost:8082/serverpath${sessionScope.user.userHeadpath}" /></a></c:otherwise>
										</c:choose>
											
										</div>
									</div>
									<div class="WB_innerwrap">
										<div class="nameBox">
											<a class="box_name" href="#">${sessionScope.user.userName }</a>
										</div>
										<ul class="user_atten">
											<li class="S_line1">
												<a class="S_txt1" href="#">
													<strong node-type="follow">${sessionScope.user.userConcernnum }</strong>
													<span class="S_txt2">关注</span>
												</a>
											</li>
											<li class="S_line1">
												<a class="S_txt1" href="#">
													<strong node-type="follow">${sessionScope.user.userFans }</strong>
													<span class="S_txt2">粉丝</span>
												</a>
											</li>
											<li class="S_line1">
												<a class="S_txt1" href="#">
													<strong node-type="follow">${sessionScope.user.userWbnum }</strong>
													<span class="S_txt2">微博</span>
												</a>
											</li>
										</ul>
									</div>
								</div>
							</div>
							<div class="WB_right_module">
								<div class="WB_cardtitle_b">
									<span class="main_title">
										<a href="#">热门话题</a>
									</span>
									<i class="icon icon-spin icon-spinner-snake"></i>
									<span class="opt_box">
										<a href="#">换一换</a>
									</span>
								</div>
								<div class="WB_innerwrap">
									<div class="m_wrap">
										<ul class="hot_topic">
										  <c:forEach items="${topicList}" var="topic">
											<li>
												<p>
													<span class="total S_txt2" title="阅读量">${topic.topicReadnum }万</span>
													<a href="#">${topic.topicName }</a>
												</p>
											</li>
										  </c:forEach>
										</ul>
									</div>
								</div>
								<a class="WB_cardmore" href="#">查看更多 ></a>
							</div>
							<div class="img_1">

							</div>
							<div class="img_2">

							</div>
						</div>
					</div>

				</div>
			</div>

			<div class="plc_foot">

			</div>
		</div>

		</div>
		<!-- Modal -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<form id="myform2">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title" id="myModalLabel">头条文章</h4>
					</div>
					<div class="modal-body">
						<!--标题-->
						<div class="text_title">
							<input class="title_msg" type="text" name="titleName" id="" value="" placeholder="请输入标题" />
							<div class="limit_text">
								<span class="words_len">0</span>/<span class="max_words">44</span>
							</div>
						</div>
						<!--封面图片-->
						<div class="text_img">
							<div class="layui-upload">
								<button type="button" class="layui-btn" id="test1">上传封面图片
								<input class="article_imgpath" type="text" name="logImgPath" value="" style="display:none">
								</button>
								<div class="layui-upload-list">
									<img class="layui-upload-img" id="demo1" style="height: 100px;width: 200px;">
									<p id="demoText"></p>
								</div>
							</div>
						</div>

						<!--文本编辑器-->
						<div style="margin:20px auto;width:550px;">

							<div id="standalone-container">
								<div id="toolbar-container">
									<span class="ql-formats">
			<select class="ql-font"></select>
			<select class="ql-size"></select>
			</span>
									<span class="ql-formats">
			<button class="ql-bold"></button>
			<button class="ql-italic"></button>
			<button class="ql-underline"></button>
			<button class="ql-strike"></button>
			</span>
									<span class="ql-formats">
			<select class="ql-color"></select>
			<select class="ql-background"></select>
			</span>
									<span class="ql-formats">
			<button class="ql-script" value="sub"></button>
			<button class="ql-script" value="super"></button>
			</span>
									<span class="ql-formats">
			<button class="ql-header" value="1"></button>
			<button class="ql-header" value="2"></button>
			<button class="ql-blockquote"></button>
			<button class="ql-code-block"></button>
			</span>
									<span class="ql-formats">
			<button class="ql-list" value="ordered"></button>
			<button class="ql-list" value="bullet"></button>
			<button class="ql-indent" value="-1"></button>
			<button class="ql-indent" value="+1"></button>
			</span>
									<span class="ql-formats">
			<button class="ql-direction" value="rtl"></button>
			<select class="ql-align"></select>
			</span>
									<span class="ql-formats">
			<button class="ql-link"></button>
			<button class="ql-image"></button>
			<button class="ql-video"></button>
			<button class="ql-formula"></button>
			</span>
									<span class="ql-formats">
			<button class="ql-clean"></button>
			</span>
								</div>
								<div id="editor-container"></div>
							</div>

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary publish_text">发布</button>
					</div>
				</div>
				</form>
			</div>
		</div>
		</div>
		<script src="../../../common/js/dist/katex.min.js"></script>
		<script src="../../../common/js/dist/highlight.min.js"></script>
		<script src="../../../common/js/dist/quill.js"></script>
		<!-- Initialize Quill editor -->
		<script>
			var quill = new Quill('#editor-container', {
				modules: {
					formula: true,
					syntax: true,
					toolbar: '#toolbar-container'
				},
				placeholder: 'Compose an epic...',
				theme: 'snow'
			});
		</script>
<!--************************************************************************************************************-->		
		<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">添加话题</h4>
      </div>
      <div class="modal-body">
        <input class="topic_txt" name="topicName" type="text" placeholder="请输入要插入的话题" value="" />
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary insert_topic">插入</button>
      </div>
    </div>
  </div>
</div>
	</body>

</html>